/*

Rules to provide the dark colors

Important:   
    - No layout information should be provided.
    - To layout a control, see controls.css.
    - To layout a workbench UI, see workbench.css

*/

.darkPlus body {
    background: #202020 !important;
    color: #e0e0e0;
}

/* a */

.darkPlus a {
    color: white;
}

/* input */

.darkPlus input, .darkPlus textarea {
    background: #2e2e2e;
    color: #f0f0f0;
    border-style: solid;
    border-width: 1px;
    border-color: #4e4e4e;
}

.darkPlus input[type="file"] {
    display: none;
}

.darkPlus input:focus, .darkPlus textarea:focus {
    background: #2a2a2a;
    border-color: #f59c5c;
    outline-style: none;
}

.darkPlus input:read-only, .darkPlus textarea:read-only {
    background: #4a4a4a;
}

/* button */

.darkPlus button,
.darkPlus input[type="submit"] {
    background: #323232;
    border-color: #646464;
    color: #f0f0f0;
    text-shadow: 1px 1px #0e0e0e;    
    border-style: solid;
    border-width: 1px;
    border-radius: 3px;
    padding: 5px;
}

.darkPlus button[disabled] {
    color: rgba(0, 0, 0, 0.4);
    text-shadow: 1px 1px rgba(255, 255, 255, 0.4);
}

.darkPlus button:hover {
    background: #3b3b3b;
}

.darkPlus button[disabled]:hover {
    background: #353535;
}

.darkPlus button:active {
    background: #343434;
}

/* Tooltip */

.darkPlus .Tooltip {
    background: #151515;
    border-color: rgba(255, 255, 255, 0.5);
    border-radius: 3px;
}

/* TabPane */

.darkPlus .TabPaneContentArea,
.darkPlus .TabPaneLabel.selected {
    background: #343434;
}

.darkPlus .TabPaneContentArea:empty {
    background: transparent !important;
}

.darkPlus .TabPaneLabel.selected {
    text-shadow: 1px 1px #0e0e0e;
}

/* Part */

.darkPlus .TabPane.activePart .TabPaneLabel.selected {
    box-shadow: inset 0px 2px 0px #f0a050;
}

.darkPlus .TabPane.activePart .TabPaneContentArea,
.darkPlus .TabPane.activePart .TabPaneLabel.selected {
    background: #3f3f3f;
}

.darkPlus .ViewerPart .FilteredViewer {
    background: transparent;
}

/* ViewerPart */

.darkPlus .ViewerPart {
    display: grid;
    grid-template-columns: 2px 1fr 2px;
    grid-template-rows: 0px 1fr 0px;
}

/* Scroll Bar */

.darkPlus {
    /* firefox */
    scrollbar-color: #4b4b4b #858585;
}

.darkPlus .ScrollBar,
.darkPlus ::-webkit-scrollbar-track {
    background: #ffffff08;
}

.darkPlus .ScrollHandler,
.darkPlus ::-webkit-scrollbar-thumb {
    background: #606060;
}

.darkPlus .ScrollHandler:hover,
.darkPlus ::-webkit-scrollbar-thumb:hover {
    background: #656565;
}

.darkPlus .ScrollHandler:active,
.darkPlus ::-webkit-scrollbar-thumb:active {
    background: #767676;
}

/* Property Page */

.darkPlus .PropertyTitleArea {
    background: #20202088;    
}

.darkPlus .PropertyTitleArea label,
.darkPlus .PropertySubTitleLabel {
    font-weight: bold;
}

/* Toolbar */

.darkPlus .ToolbarItem {
    background: #323232;
    border-color: #646464;
    text-shadow: 1px 1px #0e0e0e;
}

.darkPlus .ToolbarItem:hover,
.darkPlus .IconButton:hover {
    background: #424242;
    border-color: #757575;
}

.darkPlus .ToolbarItem:active,
.darkPlus .ToolbarItem.ActionSelected,
.darkPlus .IconButton:hover {
    background: rgba(255, 255, 255, 0.3);
}

.darkPlus .ToolbarItem.ActionSelected {
    border-color: #858585;
}


/* ProgressBar */

.darkPlus .ProgressBar {
    background: #f0a050;
}

/* Dialog */

.darkPlus .darkPlusDialogContainer {
    background: #202020;
}

.darkPlus .Dialog {
    background: #3f3f3f;
}

.darkPlus .Dialog .DialogTitlePane {
    text-shadow: 1px 1px #0e0e0e;
}

/* Menu */

.darkPlus .Menu {
    list-style-type: none;
    background: #2f2f2f;
    padding: 0px;
    margin: 0px;
    border-style: solid;
    border-width: 1px;
    border-color: #4f4f4f;
}

.darkPlus .MenuItemSeparator {
    background: #3f3f3f;
}

.darkPlus .MenuItem:hover, .darkPlus .MenuItemSelected {
    background: #f0a050;
    color: #0e0e0e;
}

.darkPlus .MenuItemDisabled {
    color: rgba(255, 255, 255, 0.5);
}

.darkPlus .MenuItemDisabled:hover {
    color: #3e3e3e;
}